<script setup lang="ts">
import { inject, type Ref } from 'vue'

interface ThemeData {
  current: Ref<string>
  toggle: () => void
}

// 注入主题相关的值，并指定类型
const theme = inject<ThemeData>('theme')!
</script>

<template>
  <div class="theme-switch">
    <p>当前主题: {{ theme.current }}</p>
    <button @click="theme.toggle">
      切换主题
    </button>
  </div>
</template>

<style scoped>
.theme-switch {
  padding: 10px;
}

button {
  padding: 5px 15px;
}
</style> 